<div class="sm-rightPanel">
    <div class="layui-anim layui-anim-upbit">
        <div id="list_form" class="layui-form sm-operation">
            <blockquote class="site-text layui-elem-quote">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">登陆名称：</label>
                        <div class="layui-input-inline">
                            <input name="account" type="text" autocomplete="off" placeholder="登陆名称"
                                   class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">手机号：</label>
                        <div class="layui-input-inline">
                            <input name="mobile" type="text" autocomplete="off" placeholder="手机号"
                                   class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">状态：</label>
                        <div class="layui-input-inline">
                            <select id="status" name="status" lay-filter="statusList">
                                <option value="">全部</option>
                                <option value="0">启用</option>
                                <option value="1">禁用</option>
                                <option value="2">锁定</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <button class="layui-btn" id="query"><i class="iconfont icon-sousuo"></i>查询</button>
                    </div>
                </div>
            </blockquote>
            <div class="layui-form-item">
                <button class="layui-btn layui-btn-normal" id="user_add">
                    <i class="iconfont icon-add"></i>添加
                </button>
                <button class="layui-btn layui-btn-warm" id="user_reset">
                    <i class="iconfont icon-bianji1"></i>重置密码
                </button>
                <button class="layui-btn layui-btn-danger" id="user_del">
                    <i class="iconfont icon-delete"></i>删除
                </button>
            </div>
        </div>
        <table id="list_table" class="layui-hide" lay-filter="mainList"></table>
    </div>
</div>
<script>
    layui.use(['layer', 'table', 'form'], function () {
        var layer = layui.layer;
        var table = layui.table;
        var form = layui.form;
        var $ = layui.$;

        //表单重新渲染
        form.render();

        //表格渲染
        var tableObj = table.render({
            id: 'list_table',
            elem: '#list_table',
            url: '/sys/user/list',
            align: "center",
            cols: [[ //表头
                {type: 'checkbox'},
                {type: 'numbers', title: '序号', width: 50},
                {field: 'account', title: '登陆名称', width: 140, align: 'center'},
                {field: 'userName', title: '用户名称', width: 120, align: 'center'},
                {field: 'mobile', title: '手机号', width: 140, align: 'center'},
                {field: 'deptName', title: '所属部门', width: 120, align: 'center'},
                {field: 'email', title: '邮箱', width: 150, align: 'center'},
                {
                    field: 'sex', title: '性别', width: 70, align: 'center', templet: function (d) {
                    return d.sex == 1 ? '男' : d.sex == 2 ? '女': '未知';
                }
                },
                {
                    field: 'status', title: '状态', width: 70, align: 'center', templet: function (d) {
                    return d.status == 0 ? '<span class="font-success">启用</span>' : d.status == 1 ? '<span class="font-danger">禁用</span>' : '<span class="font-disabled">锁定</span>';
                }
                },
                {field: 'createTime', title: '添加时间', width: 170, align: 'center'},
                {
                    field: 'lock', title: '操作', width: 170, templet: function (d) {
                    return d.systemFlag == 1 ?
                    '<button class="layui-btn layui-btn-sm layui-btn-disabled" lay-event="edit" disabled>修改</button>' + '<button class="layui-btn layui-btn-sm layui-btn-disabled" lay-event="settingRoles" disabled>设置角色</button>' :
                    '<button class="layui-btn layui-btn-warm layui-btn-sm" lay-event="edit">修改</button>' + '<button class="layui-btn layui-btn-warm layui-btn-sm" lay-event="settingRoles">设置角色</button>';
                }, unresize: true, align: 'center'
                }
            ]]
        });

        //监听工具条
        table.on('tool(mainList)', function (obj) {
            var data = obj.data
                , layEvent = obj.event;
            //修改
            if (layEvent === 'edit') {
                smartAui.dialog({
                    title: '修改'
                    , template: 'edit'
                    , saveUrl: '/sys/user/update'
                    , tableObj: tableObj
                    , width: 500
                    , height: 600
                    , htmlData: data
                })
            }
            // 设置角色
            if (layEvent === 'settingRoles') {
                smartAui.dialog({
                    title: '设置角色'
                    , template: 'settingroles'
                    , saveUrl: '/sys/user/role/save'
                    , tableObj: tableObj
                    , width: 400
                    , height: 500
                    , htmlData: data
                })
            }
        });

        // 添加
        $("#user_add").click(function () {
            smartAui.dialog({
                title: '添加'
                , template: 'add'
                , saveUrl: '/sys/user/save'
                , tableObj: tableObj
                , width: 500
                , height: 600
                , beforeSubmit: function (d) {
                    if ($("#dialog_form input[name='password']").val() != $("#dialog_form input[name='rePassword']").val()) {
                        layer.msg('两次密码不一致');
                        return false;
                    }
                    return true;
                }
            })
        });
        // 重置密码
        $("#user_reset").click(function () {
            var data = table.checkStatus('list_table').data;//已选中数据
            if (data.length == 0) {
                layer.msg("请至少选择一条");
                return;
            }
            var arr = [];
            for (var i = 0; i < data.length; i++) {
                if (data[i].systemFlag != 1) {
                    arr.push(data[i].userId)
                }
            }
            smartAui.confirm('确认要重置密码吗？', function () {
                $.ajax({
                    type: "post",
                    url: '/sys/user/reset/password',
                    data: {"userIds[]": arr},
                    success: function (result) {
                        if (result.success) {
                            layer.msg("重置成功");
                            smartAui.reloadTable(tableObj);
                        }
                    },
                    error: function () {
                        layer.msg("处理异常");
                    }
                })
            }, 0);
        });
        // 删除
        $("#user_del").click(function () {
            var data = table.checkStatus('list_table').data;//已选中数据
            if (data.length == 0) {
                layer.msg("请至少选择一条");
                return;
            }
            //是否系统标志
            if (data.length == 1 && data[0].systemFlag == 1) {
                layer.msg("系统数据禁止删除");
                return;
            }
            var arr = [];
            for (var i = 0; i < data.length; i++) {
                if (data[i].systemFlag != 1) {
                    arr.push(data[i].userId);
                }
            }
            smartAui.confirm("确认删除？", function () {
                $.ajax({
                    type: "post",
                    url: '/sys/user/deleteBatch',
                    data: {"userIds[]": arr},
                    success: function (result) {
                        if (result.success) {
                            layer.msg("删除成功");
                            smartAui.reloadTable(tableObj);
                        }
                    },
                    error: function () {
                        layer.msg("删除异常");
                    }
                })
            }, 0);
        });
        $("#query").click(function () {
            smartAui.reloadTable(tableObj);
        });
    });
</script>